<!doctype html>
<html lang="en">
<head>
    <base href="/">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="Epilog Theme">
    <title>Bizlamp - Multipurpose eCommerce HTML Template</title>

    <!-- Favicons -->
    <link rel="icon" type="image/png" href="assets/images/favicon.png">

    <!-- CSS Files -->
    <link rel="stylesheet" href="assets/css/aos.css">
    <link rel="stylesheet" href="assets/css/animate.min.css">
    <link rel="stylesheet" href="assets/css/boxicons.min.css">
    <link rel="stylesheet" href="assets/css/owl.carousel.min.css">
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/mailform.css">
    <link rel="stylesheet" href="assets/css/style.css?v=1.0.1">
    <link rel="stylesheet" href="assets/css/responsive.css?v=1.0.1">
    <link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>
    <!-- Header Area Start -->
    <header class="header-area">
        <div class="main-navbar">
            <div class="container">
                <nav class="navbar navbar-expand-lg navbar-light">
                    <a class="navbar-brand" href="shopping/index">
                        <img src="assets/images/logo.png" alt="logo">
                    </a>
                    <ul class="cart-menu responsive">
                        <li>
                            <a id="dropdownCartButton" class="position-relative" data-toggle="dropdown" href="#"><span class="item-count">10</span> <i class="bx bx-cart-alt"></i> </a>
                            <div class="dropdown">
                                <div class="dropdown-menu cart-dropdown" aria-labelledby="dropdownCartButton">
                                    <p>2 item(s) in your cart - <span>$665.00</span></p>
                                    <div class="minicart-products">
                                        <div class="minicart-product-info d-flex">
                                            <figure>
                                                <a href="#"> <img class="img-border" src="assets/images/products/product_01.png" alt="Home Decoration"></a>
                                            </figure>
                                            <div class="product-meta">
                                                <h5 class="product-title">
                                                    <a href="#">Artisan Craft Design Product Handicraft</a>
                                                </h5>
                                                <span class="product-price">1 x $280.00</span>
                                            </div>
                                            <a class="delete-btn" href="#" title="Delete Product">
                                                <span class="item-delete"><i class="bx bx-trash"></i></span>
                                            </a>
                                        </div>
                                        <div class="minicart-product-info d-flex">
                                            <figure>
                                                <a href="#"> <img class="img-border" src="assets/images/products/product_02.png" alt="Home Decoration"></a>
                                            </figure>
                                            <div class="product-meta">
                                                <h5 class="product-title">
                                                    <a href="#">Duis sodales ligula et orci pretium tempus</a>
                                                </h5>
                                                <span class="product-price">1 x $280.00</span>
                                            </div>
                                            <a class="delete-btn" href="#" title="Delete Product">
                                                <span class="item-delete"><i class="bx bx-trash"></i></span>
                                            </a>
                                        </div>

                                        <div class="minicart-product-calculation">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <p><strong>Shipping:</strong> <span>$7.00</span></p>
                                                    <p><strong>Tax:</strong> <span>Free</span></p>
                                                    <p><strong>Total: </strong> <span>$665.00</span></p>
                                                </div>
                                                <div class="col-md-6">
                                                    <div class="dcart-action">
                                                        <a href="shopping/cart" class="btn btn-primary">View Cart</a>
                                                        <a href="checkout.html" class="btn btn-secondary">Checkout</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a id="dropdownUserButton" data-toggle="dropdown" href="#"><i class="bx bx-user-circle"></i> </a>
                            <div class="dropdown">
                                <div class="dropdown-menu user-dropdown" aria-labelledby="dropdownUserButton">

                                    <a class="dropdown-item" href="#"><i class="bx bx-user-circle"></i> My Account</a>
                                    <a class="dropdown-item" href="#"><i class="bx bx-heart"></i> My Wishlist</a>
                                    <a class="dropdown-item" href="#"><i class="bx bx-cart-alt"></i> Checkout</a>
                                    <a class="dropdown-item" href="#"><i class="bx bx-log-in"></i> Login Or Register</a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <form class="searchbox">
                                <input type="search" placeholder="Search......" name="search" class="searchbox-input" required="">
                                <button class="searchbox-submit" type="submit"><i class="bx bx-search-alt"></i></button>
                            </form>
                            <a class="search-btn"><i class="bx bx-search-alt"></i></a>
                        </li>
                        <li>
                            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
                                <i class='bx bx-menu'></i>
                                <i class='bx bx-x'></i>
                            </button>
                        </li>
                    </ul>

                    <div class="collapse navbar-collapse mean-menu" id="navbarCollapse">
                        <ul class="navbar-nav mr-auto">
                            <li class="nav-item dropdown">
                                <a class="nav-link active" href="shopping/index">
                                    返回首页
                                </a>
                            </li>


                        </ul>
                    </div>
                </nav>

            </div>
        </div>
    </header>
    <!-- Header Area End -->

    <!-- Breadcrumbs Area Start -->
    <div class="breadcrumbs text-center">
        <div class="container">
            <h2 class="page-title">Signin</h2>
            <ul class="breadcrumbs-link">
                <li><a href="shopping/index">返回首页 <i class="bx bx-chevrons-right"></i></a></li>
                <li>Signin</li>
            </ul>
        </div>
    </div>
    <!-- Breadcrumbs Area Start -->

    <!-- Signin Area Start -->
    <div class="bl-account-wrapper">
        <div class="container">
            <div class="row">
                <div class="col-md-6 offset-md-3">
                    <div class="signup-wrapper">
                        <form action="#" method="post">
                            <h4>Signin</h4>
                            <div class="form-group">
                                <label for="username">用户名 <span class="required">*</span></label>
                                <input type="text" required class="form-control" id="username" name="username">
                            </div>
                            <div class="form-group">
                                <label for="password">密码 <span class="required">*</span></label>
                                <input type="password" required class="form-control" id="password" name="password">
                            </div>

                            <div class="form-check mt-2 mb-2">
                                <input class="form-check-input" type="checkbox" value="" id="createAnAccount">
                                <label class="form-check-label" for="createAnAccount">
                                    Remember
                                </label>
                            </div>
                            <button  type="button"  class="btn btn-primary login-btn">Login</button>

                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Signin Area End -->



    <!--  Top to Bottom  -->
    <div class="top-bottom-scroll"><i class='bx bx-chevrons-up bx-fade-up' ></i></div>

    <!-- JS Script -->
    <script src="./assets/js/jquery.min.js"></script>
    <script src="./assets/js/bootstrap.min.js"></script>
    <script src="./assets/js/popper.min.js"></script>
    <script src="./assets/js/aos.js"></script>
    <script src="./assets/js/mailform.js"></script>
    <script src="./assets/js/owl.carousel.min.js"></script>
    <script src="./assets/js/main.js?v=1.0.0"></script>
</body>

<script src="layui/layui.all.js"></script>

<script>
    const $=layui.$;
    const layer=layui.layer;
    $(".login-btn").click(function(){
        let username=$("[name='username']").val();
        let password=$("[name='password']").val();

        let reg=/^[a-zA-Z0-9]{6,16}$/;
        if(reg.test(username)&&reg.test(password)){
            console.log("successssss");
            //登录
            $.ajax({
                url:'shopping/dologin',
                data:{username:username,password:password},
                success:function(result){
                    console.log("successssssssssss")
                    if(result=="success"){
                        layer.msg("登陆成功",{icon:1});
                        setTimeout(function(){
                            location.href="shopping/index";
                        },1800)
                    }else {
                        layer.msg("登陆失败");

                    }
                }
            })
        }
        else{
        layer.msg("用户名和密码必须是6-16位字符数字");

        }
    })
</script>
</html>